<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2022/10/14
  Time: 13:24
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>医生查询所有订单</title>
    <!--引入elementui的样式-->
    <!-- 引入外部样式-->
    <link type="text/css" rel="stylesheet" href="css/index.css">
    <!-- 引入相关插件，也叫依赖-->
    <!--引入vue的依赖，必须在elementui之前引入vue-->
    <script type="text/javascript" src="js/vue.js"></script>
    <script type="text/javascript" src="js/index.js"></script>
    <script type="text/javascript" src="js/axios.min.js"></script>

</head>
<body>
<div id="app">


    <div>
        <el-button type="success" @click="daochu()">导出信息</el-button>
    </div>

    <template>
        <el-table
                :data="tableData"
                stripe
                style="width: 100%"
                :cell-style="styleBack"
                :header-cell-style="getRowClass"

        >
            <el-table-column
                    prop="mZfid"
                    label="订单号"
                    width="">
            </el-table-column>
            <el-table-column
                    prop="mIdcard"
                    label="患者身份证号"
                    width="">
            </el-table-column>

            <el-table-column
                    prop="mSex"
                    label="性别"
                    width="">
            </el-table-column>

            <el-table-column
                    prop="mAge"
                    label="年龄"
                    width="">
            </el-table-column>

            <el-table-column
                    prop="mTelephone"
                    label="电话"
                    width="">
            </el-table-column>

            <el-table-column
                    prop="mZstatus"
                    label="支付状态">
                <template slot-scope="scope">
                    <el-tag type="danger" v-if="scope.row.mZstatus == 0">未支付</el-tag>
                    <el-tag type="success" v-else-if="scope.row.mZstatus == 1">支付成功</el-tag>
                    <el-tag size="small" v-else>暂未</el-tag>

                </template>
            </el-table-column>

            <el-table-column
                    prop="cCases"
                    label="病情">
            </el-table-column>

            <el-table-column
                    prop="cSuggest"
                    label="医嘱">
            </el-table-column>

            <el-table-column
                    prop="dName"
                    label="处理医师">
                <template slot-scope="scope">

                    <el-tag >{{scope.row.dName}}</el-tag>
                </template>
            </el-table-column>


        </el-table>
    </template>


</div>
</body>
<script>
    let vue = new Vue({
        el: "#app",
        data: {
            tableData: [],

        },
        created() {
            this.intoTable();
        },
        methods: {


            daochu(){
                let ab=new Array();
                this.tableData.forEach(value=>{
                    let b={};
                    b.id=value.mZfid
                    b.idCard=value.mIdcard
                    b.sex=value.mSex
                    b.age=value.mAge
                    b.phone=value.mTelephone
                    b.cause=value.cCases
                    b.advice=value.cSuggest
                    b.doctor=value.dName
                    ab.push(b)
                })

                axios.post("/excel/download2",ab,{responseType: 'blob'}).then(function (response){
                    let blob = new Blob([response.data])
                    console.log(blob)
                    let downloadElement = document.createElement('a');
                    let href = window.URL.createObjectURL(blob); //创建下载的链接
                    downloadElement.href = href;
                    downloadElement.download = '病人信息.xlsx'; //下载后文件名
                    document.body.appendChild(downloadElement);
                    downloadElement.click(); //点击下载a
                    document.body.removeChild(downloadElement); //下载完成移除元素
                    window.URL.revokeObjectURL(href); //释放掉blob对象

                })
                console.log(a)
            },

            intoTable() {
                axios.get("/order/all").then(resp => {
                    this.tableData = resp.data.data;
                })
            },

            // 表格奇偶层样式
            styleBack({ row, column, rowIndex, columnIndex }) {
                if ((rowIndex + 1) % 2 === 0) {
                    return "background:#053c4a; color:#fff;border:1px solid #053c4a";
                } else {
                    return "background:#042831; color:#fff;border:1px solid #042831";
                }
            },
            // 表头样式
            getRowClass({ rowIndex }) {
                return "background:#053c4a; color:#fff;border:3px solid #053c4a";
            },
        }
    });
</script>
</html>